<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style type="text/css">
	#wrapper{
		margin-left: 70px;
		width: 800px;
		margin-bottom: 270px;
	}
	.product_line { 
		width:705px; height:2px; float:left; background:#d3ccbe;
	}
	#giftCardDetail td{
		padding-left: 40px;
	}
	#giftCardDetail th{
		width: 150px;
	}
	a{
		cursor: pointer;
	}
</style>
<script type="text/javascript">
	function goLogin(){
		alert('로그인 해주시기 바랍니다!');
		location.href='login.do';
	}
</script>
</head>
<body>
	<div id="wrapper">
		<table>
			<tr>
				<td style="vertical-align: bottom; text-align: left">
					<img src="images/giftcard/giftcard_menu.png" width="80%">
				</td>
				<td style="text-align: right" width="550px">
					<img src="images/giftcard/giftcard_menu_img.png" width="55%">
				</td>
			</tr>
		</table>
		<p class="product_line"></p>
		<br>
		<!-- 상세 페이지 (구매 페이지) -->
		<div id="giftCardDetail">
			<form action="purchase.do" method="GET">
			<!-- 상품권 번호, 상품권 이름, 실제가격, 배송비, 주문수량 -->
			<input type="hidden" name="item_num" value="${giftCard.item_num}">
			<table style="width: 670px; height: 300px; font-family: nanum; margin-left: 20px; margin-top: 20px"> 
				<tr>
					<td rowspan="6" width="290px" style="border: 1px solid #D2D1D0; text-align: center; padding:0 0 0 0;">
						<img src="images/giftcard/giftcard${giftCard.item_num}.png" width="270px;">
					</td>
					<td colspan="2" style=" height:50px; text-align: center; font-size: 20pt; font-weight: bold; padding:0 0 0 0;">
					${giftCard.item_name}</td>
				</tr>
				<tr>
					<th>소비자가</th>
					<td style="text-decoration: line-through;">${giftCard.item_price}</td>
				</tr>
				<tr>
					<th>할인가</th>
					<td style="font-weight: bold; color: #870200;">${discountPrice}</td>
				</tr>
				<tr>
					<th>전송방법</th>
					<td>결제 후 핸드폰으로 전송</td>
				</tr>
				<tr>
					<th>주문 수량</th>
					<td>
						<select name="quantity">
							<option value="1">1</option>
							<option value="2">2</option>
							<option value="3">3</option>
							<option value="4">4</option>
							<option value="5">5</option>
						</select>
					</td>
				</tr>
				<tr style="vertical-align: bottom;">
					<td colspan="2" style="padding-left: 100px;">
						<c:if test="${giftCard.item_num >=1000 && giftCard.item_num <=1002}">
							<img src="images/giftcard/listBtn.gif" onclick="location.href='giftCardList.do#coffeecards'">
						</c:if>
						<c:if test="${giftCard.item_num >=1003 && giftCard.item_num <=1005}">
							<img src="images/giftcard/listBtn.gif" onclick="location.href='giftCardList.do#blogcomments'">
						</c:if>
						<c:if test="${giftCard.item_num >=1006 && giftCard.item_num <=1008}">
							<img src="images/giftcard/listBtn.gif" onclick="location.href='giftCardList.do#onlineform'">
						</c:if>
						<c:if test="${!empty email}">
							<input type="image" src="images/giftcard/orderBtn.gif">
						</c:if>
						<c:if test="${empty email}">
							<img src="images/giftcard/orderBtn.gif" style="cursor: pointer;" 
								 onclick="goLogin();">
						</c:if>
					</td>
				</tr>
			</table>
			</form>
		</div>
		<p class="product_line"></p><br>
			<ul style="font-family: nanum;">
				<li style="color: #870200; font-weight: bold;">본 제품 교환권은 커피 하겐나 홈페이지에서만 할인된 가격으로 구매하실 수 있습니다.</li>
				<li>본 제품 교환권은 각 제품 카테고리 내에서 가장 인기있는 상품으로 구성된 것입니다.</li>
				<li>본 제품 교환권은 10매가 한 set이며, 1매씩 구매는 불가능합니다.</li>
				<li>본 제품 교환권은 최대 50매 구매하실 수 있습니다.</li>
				<li>본 제품 교환권은 각각 기재된 제품으로 교환하실 수 있습니다.</li>
				<li>
					기재된 제품과 가격이 동일하고, 동일한 카테고리 내에 있는 상품으로의 교환도 가능합니다.<br>
					<span style="font-size: 10pt">(ex. 리얼초코 → 그린티,레드애플)</span>
				</li>
				<li style="color: #004000; font-weight: bold;">
					본 제품 교환권을 구매하시려면 해당 교환권 이미지를 클릭하세요!</li>
			</ul>
	</div>
</body>
</html>